﻿<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>MU-css</title>
<meta name="keywords" content="MU-CSS"/>
<meta name="description" content="MU-CSS"/>
<link rel="stylesheet" href="mu.css"/>
<script type="text/javascript" src="js/class/jquery.js"></script>
<!--[if IE]><script type="text/javascript" src="js/class/DD_roundies.js"></script><![endif]-->
<!--[if IE 6]><script type="text/javascript" src="js/class/DD_belatedPNG.js"></script><![endif]-->
<!--[if IE]><script type="text/javascript" src="js/iefix.js"></script><![endif]-->
</head>
<body>
普通顶部导航
<div class="topbar">
	<div class="">
		<div class="logo">
			<a href="./"><font class="danley">keqie</font> 渴切</a>
		</div>
		<div class="collapse">菜单</div>
		<div class="module">
			<a href="index.html">概述</a>
			<a href="grid.html">框架</a>
			<a href="base.html">基础css</a>
			<a href="widget.html" class="selected">组件</a>
			<a href="javascript.html">javascript</a>
		</div>
		<div class="sub">
			<a href="index.html">例子</a>
			<a href="http://mobile.keqie.com">移动版</a>
		</div>
	</div>
</div>
带搜索栏顶部导航
<div class="topbar">
	<div class="">
		<div class="logo">
			<a href="./"><font class="danley">keqie</font> 渴切</a>
		</div>
		<div class="collapse">菜单</div>
		<div class="module">
			<a href="index.html">概述</a>
			<a href="grid.html">框架</a>
			<a href="base.html">基础css</a>
			<a href="widget.html" class="selected">组件</a>
			<a href="javascript.html">javascript</a>
		</div>
		<form class="search">
			<input name="" type="text" value="" placeholder="请输入关键字" class="text">
			<input name="" type="button" class="button" value="搜索">
		</form>
		<div class="sub">
			<a href="index.html">例子</a>
			<a href="http://mobile.keqie.com">移动版</a>
		</div>
	</div>
</div>
固定顶部跟随滚动导航
<div class="topbar fixed">
	<div class="">
		<div class="logo">
			<a href="./"><font class="danley">keqie</font> 渴切</a>
		</div>
		<div class="collapse">菜单</div>
		<div class="module">
			<a href="index.html">概述</a>
			<a href="grid.html">框架</a>
			<a href="base.html">基础css</a>
			<a href="widget.html" class="selected">组件</a>
			<a href="javascript.html">javascript</a>
		</div>
		<form class="search">
			<input name="" type="text" value="" placeholder="请输入关键字" class="text">
			<input name="" type="button" class="button" value="搜索">
		</form>
		<div class="sub">
			<a href="index.html">例子</a>
			<a href="http://mobile.keqie.com">移动版</a>
		</div>
	</div>
</div>
<div style="width:900px; height:1000px;">这是占位DIV</div>
带不同底色顶部导航
<div class="topbar blue">
	<div class="">
		<div class="logo">
			<a href="./"><font class="danley">keqie</font> 渴切</a>
		</div>
		<div class="collapse">菜单</div>
		<div class="module">
			<a href="index.html">概述</a>
			<a href="grid.html">框架</a>
			<a href="base.html">基础css</a>
			<a href="widget.html" class="selected">组件</a>
			<a href="javascript.html">javascript</a>
		</div>
		<form class="search">
			<input name="" type="text" value="" placeholder="请输入关键字" class="text">
			<input name="" type="button" class="button" value="搜索">
		</form>
		<div class="sub">
			<a href="index.html">例子</a>
			<a href="http://mobile.keqie.com">移动版</a>
		</div>
	</div>
</div>
<div class="topbar yellow">
	<div class="">
		<div class="logo">
			<a href="./"><font class="danley">keqie</font> 渴切</a>
		</div>
		<div class="collapse">菜单</div>
		<div class="module">
			<a href="index.html">概述</a>
			<a href="grid.html">框架</a>
			<a href="base.html">基础css</a>
			<a href="widget.html" class="selected">组件</a>
			<a href="javascript.html">javascript</a>
		</div>
		<form class="search">
			<input name="" type="text" value="" placeholder="请输入关键字" class="text">
			<input name="" type="button" class="button" value="搜索">
		</form>
		<div class="sub">
			<a href="index.html">例子</a>
			<a href="http://mobile.keqie.com">移动版</a>
		</div>
	</div>
</div>
<div class="topbar red">
	<div class="">
		<div class="logo">
			<a href="./"><font class="danley">keqie</font> 渴切</a>
		</div>
		<div class="collapse">菜单</div>
		<div class="module">
			<a href="index.html">概述</a>
			<a href="grid.html">框架</a>
			<a href="base.html">基础css</a>
			<a href="widget.html" class="selected">组件</a>
			<a href="javascript.html">javascript</a>
		</div>
		<form class="search">
			<input name="" type="text" value="" placeholder="请输入关键字" class="text">
			<input name="" type="button" class="button" value="搜索">
		</form>
		<div class="sub">
			<a href="index.html">例子</a>
			<a href="http://mobile.keqie.com">移动版</a>
		</div>
	</div>
</div>
无样式导航
<div class="topbar unstyled">
	<div class="">
		<div class="logo">
			<a href="./"><font class="danley">keqie</font> 渴切</a>
		</div>
		<div class="collapse">菜单</div>
		<div class="module">
			<a href="index.html">概述</a>
			<a href="grid.html">框架</a>
			<a href="base.html">基础css</a>
			<a href="widget.html" class="selected">组件</a>
			<a href="javascript.html">javascript</a>
		</div>
		<form class="search">
			<input name="" type="text" value="" placeholder="请输入关键字" class="text">
			<input name="" type="button" class="button" value="搜索">
		</form>
		<div class="sub">
			<a href="index.html">例子</a>
			<a href="http://mobile.keqie.com">移动版</a>
		</div>
	</div>
</div>
含二级目录导航
<div class="topbar">
	<div class="">
		<div class="logo">
			<a href="./"><font class="danley">keqie</font> 渴切</a>
		</div>
		<div class="collapse">菜单</div>
		<div class="module">
			<ul>
				<li>
					<strong><a href="index.html" class="selected">菜单1</a></strong>
				</li>
				<li>
                    <strong><a href="###">菜单2</a></strong>
                    <div class="droper">
                        <a href="#">子菜单1</a>
                        <a href="#" target="_blank">子菜单2</a>
                        <a href="#" target="_blank">子菜单3</a>
                        <a href="#" target="_blank">子菜单4</a>
                        <a href="#" target="_blank">子菜单5</a>
                    </div>
                </li>
                <li>
                    <strong><a href="###">菜单3</a></strong>
                    <div class="droper">
                        <a href="#">子菜单1</a>
                        <a href="#" target="_blank">子菜单2</a>
                        <a href="#" target="_blank">子菜单3</a>
                        <a href="#" target="_blank">子菜单4</a>
                        <a href="#" target="_blank">子菜单5</a>
                    </div>
                </li>
            </ul>
		
		
		</div>
		<form class="search">
			<input name="" type="text" value="" placeholder="请输入关键字" class="text">
			<input name="" type="button" class="button" value="搜索">
		</form>
		<div class="sub">
			<a href="index.html">例子</a>
			<a href="http://mobile.keqie.com">移动版</a>
		</div>
	</div>
</div>
</body>
</html>